div.calendar-module {
    height:100%;
}

div.calendar-module .button {
    text-transform:uppercase;
    font-weight:bold;
    font-size:9px;
}

div.calendar-module > div.menu {
    position:relative;
    border-bottom:1px solid #dedede;
    padding-bottom:10px;
}

div.calendar-module > div.menu > div button {
    height:25px;
}

div.calendar-module > div.menu > div.left {
    position:absolute;
    top:0;
    left:0;
}

div.calendar-module > div.menu > div.right {
    float:right;
}

div.calendar-module > div.menu > div.left > button.today {
    padding-top:5px;
    width:75px;
}

div.calendar-module > div.menu > div.left > div.button-group > button {
    width:26px;
    padding:5px 0px;
    font-size:16px;
}

div.calendar-module > div.menu > div.left > strong {
    font-size:14px;
    line-height:normal;
    font-weight:normal;
    vertical-align:middle;
}

div.calendar-module > div.menu > div.right > div.button-group > button {
    width:70px;
}




div.calendar-module > div.agenda,
div.calendar-module > div.grid {
    position:relative;
    box-sizing:border-box;
    height:calc(100% - 30px);
}

div.calendar-module > div.agenda {
    border:1px solid #dedede;
    border-top-color:transparent;
    border-radius:0 0 3px 3px;
}


/* Pantalla "No hay eventos" */
div.calendar-module > div.agenda > div.no-events {
    position:relative;
    height:100%;
    background-color:#eaf2fb;
}

div.calendar-module > div.agenda > div.no-events > div.container {
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
    height: 50%;
    width:50%;
}

div.calendar-module > div.agenda > div.no-events > div.container > strong {
    position:relative;
    display:inline-block;
    padding-left:40px;
    max-width:260px;
    color:#313131;
    font-size:24px;
    font-weight:normal;
    float:left;
    box-sizing:border-box;
    width:55%;
}


div.calendar-module > div.agenda > div.no-events > div.container > strong > span {
    position:absolute;
    top:18px;
    margin-top:-2px;
    left:0;
}


div.calendar-module > div.agenda > div.no-events > div.container > div.buttons {
    display:block;
    float:left;
    width:29%;
}

div.calendar-module > div.agenda > div.no-events > div.container > div.buttons > a {
    position:relative;
    display:block;
    width:100%;
    margin-bottom:10px;
    text-align:left;
    padding-bottom:7px;
    padding-left:30px;
    font-size:10px;
    margin-bottom:10px;
}

div.calendar-module > div.agenda > div.no-events > div.container > div.buttons > a > span {
    position:absolute;
    top:50%;
    left:10px;
    font-size:24px;
}

div.calendar-module > div.agenda > div.no-events > div.container > span.bracket {
    display:inline-block;
    width:48px;
    height:192px;
    background:url(images/bracket.svg) no-repeat 50% 50%;
    width:16%;
}


/* Menu */
div.calendar-module > div.agenda > div.menu {
    position:absolute;
    z-index:1;
    top:0;
    left:0;
    width:100%;
    box-sizing:border-box;
    background-color:#f7f7f7;
    border-bottom:1px solid #dedede;
    padding:5px;
    font-size:9px;
}

div.calendar-module > div.agenda > div.menu > div.left {
    float:left;
}

div.calendar-module > div.agenda > div.menu > div.right {
    float:right;
}

div.calendar-module > div.agenda > div.menu > div.right > strong {
    color:#8f8f8f;
    text-transform:uppercase;
    vertical-align:middle;
}

div.calendar-module > div.agenda > div.menu > div.right > input {
    background:#fff;
    width:70px;
    box-sizing:border-box;
    border:1px solid #ccc;
    border-radius:3px;
    padding:3px 3px 4px 3px;
    text-align:center;
    vertical-align:middle;
    font-size:10px;
    transition-property:background-color,border-color,color;
}

div.calendar-module > div.agenda > div.menu > div.right > input[disabled] {
    background:rgba(255,255,255,0.5);
    border-color:rgba(204, 204, 204, 0.5);
    color:#4288de;
}

div.calendar-module > div.agenda > div.menu > div.right > button {
    width:70px;
    margin-right:0;
}

div.calendar-module > div.agenda > div.menu > div.right > button.clear-filter {
    display:none;
}

div.calendar-module > div.agenda > ul.days {
    padding:0;
    margin:0;
    margin-top:32px;
    height:calc(100% - 32px);
    list-style:none;
    overflow-y:auto;
}

div.calendar-module > div.agenda > ul.days > li {
    position:relative;
    padding:15px 20px;
    padding-left:155px;
    transition-property:all;
    border-bottom:1px solid #dedede;
}

div.calendar-module > div.agenda > ul.days > li:last-child {
    border-bottom:none;
}

div.calendar-module > div.agenda > ul.days > li:hover {
    background:#f7f7f7;
}

div.calendar-module > div.agenda > ul.days > li.today {
    background:#eaf2fb;
}

div.calendar-module > div.agenda > ul.days > li.today:hover {
    background:#eaf2fb;
}

div.calendar-module > div.agenda > ul.days > li > strong {
    position:absolute;
    top:15px;
    left:20px;
    display:block;
    width:135px;
    color:#8f8f8f;
    transition-property:all;
}

div.calendar-module > div.agenda > ul.days > li:hover > strong {
    color:#313131;
}

div.calendar-module > div.agenda > ul.days > li > ul.events {
    padding:0;
    margin:0;
    list-style:none;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li {
    margin-bottom:5px;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li:last-child {
    margin-bottom:0;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li > span.hour {
    display:inline-block;
    width:60px;
    text-align:center;
    cursor:pointer;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li > button {
    background:none;
    border:0;
    font-weight:bold;
    outline:none;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li > button > span.icon {
    display:none;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li:not(.opened) > button > span.icon.squared-plus {
    display:inline-block;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li.opened > button > span.icon.squared-minus {
    display:inline-block;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="1"] > button {
    color:#09a879;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="1"] > button > span.icon.inbox {
    display:inline-block;
}


div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="2"] > button {
    color:#de870a;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="2"] > ul.info {
    border-color:#de870a;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="2"] > button > span.icon.flag {
    display:inline-block;
}


div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="3"] > button {
    color:#4288d0;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="3"] > ul.info {
    border-color:#4288d0;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="3"] > button > span.icon.star {
    display:inline-block;
}


div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="4"] > button {
    color:#ae0d0d;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="4"] > ul.info {
    border-color:#ae0d0d;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="4"] > button > span.icon.globe {
    display:inline-block;
}


div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="5"] > button {
    color:#5d5d57;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="5"] > ul.info {
    border-color:#5d5d57;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li[data-type="5"] > button > span.icon.user {
    display:inline-block;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li > button:hover > span.text,
div.calendar-module > div.agenda > ul.days > li > ul.events > li > button:focus > span.text,
div.calendar-module > div.agenda > ul.days > li > ul.events > li.opened > button {
    text-decoration:underline;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li > button.selected + ul {
    display:block;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li > ul.info {
    display:none;
    padding:0;
    margin:0;
    margin-left:80px;
    list-style:none;
    border-left:2px solid #09a879;
    padding-left:10px;
    padding-top:5px;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li.opened > ul.info {
    display:block;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li.opened > ul.info {
    display:block;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li > ul.info a:not(.button) {
    color:#4288de;
}

div.calendar-module > div.agenda > ul.days > li > ul.events > li > ul.info > li {
    margin-bottom:10px;
}




div.calendar-module > div.grid {
    padding-top:17px;
}

div.calendar-module > div.grid > table {
    width:100%;
    height:100%;
    box-sizing:border-box;
    border-radius:0 0 3px 3px;
}

div.calendar-module > div.grid > table > thead {
    color:#b5b5b5;
}

div.calendar-module > div.grid > table > thead > tr > td {
    padding-left:17px;
}

div.calendar-module > div.grid > table > tbody > tr > td {
    position:relative;
    border:1px solid #dfdfdf;
    vertical-align:top;
    width:14.2%;
    height:16.6%;
    padding:0;
}
/*
div.calendar-module > div.grid > table > tbody > tr:last-child > td {
    border-bottom:none;
}

div.calendar-module > div.grid > table > tbody > tr > td:first-child {
    border-left:none;
}

div.calendar-module > div.grid > table > tbody > tr > td:last-child {
    border-right:none;
}*/

div.calendar-module > div.grid > table > tbody > tr > td > div {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    overflow:hidden;
    transition-property:background-color;
}

div.calendar-module > div.grid > table > tbody > tr > td > div.out {
    color:#b5b5b5;
}

div.calendar-module > div.grid > table > tbody > tr > td > div.today {
    top:-1px;
    left:-1px;
    background-color:#eaf2fb;
    border:1px solid #7b8085;
    background-color:#eaf2fb;
}

div.calendar-module > div.grid > table > tbody > tr > td > div:not(.today):active,
div.calendar-module > div.grid > table > tbody > tr > td > div:not(.today).selected {
    background-color:#f2f2f2;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.day,
div.calendar-module > div.grid > table > tbody > tr > td > div > button.more { 
    display:block;
    color:inherit;
    background:none;
    border:none;
    padding:0;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.day {
    margin-top:5px;
    margin-left:8px;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.more { 
    position:absolute;
    left:9px;
    bottom:4px;
    font-size:10px;
    color:#4288de;
    text-decoration:underline;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.day:hover { 
    text-decoration:underline;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event {
    position:relative;
    display:block;
    width:100%;
    background:none;
    padding:2px 5px 4px 18px;
    border:none;
    text-align:left;
    font-size:10px;
    transition-property:all;
    outline:none;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event > span.icon {
    display:none;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="1"] {
    color:#09a879;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="1"]:active,
div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="1"].selected {
    background-color:#09a879;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="1"] > span.icon.inbox {
    display:inline-block;
}


div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="2"] {
    color:#de870a;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="2"]:active,
div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="2"].selected {
    background-color:#de870a;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="2"] > span.icon.flag {
    display:inline-block;
}


div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="3"] {
    color:#4288d0;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="3"]:active,
div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="3"].selected {
    background-color:#4288d0;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="3"] > span.icon.star {
    display:inline-block;
}


div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="4"] {
    color:#ae0d0d;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="4"]:active,
div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="4"].selected {
    background-color:#ae0d0d;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="4"] > span.icon.globe {
    display:inline-block;
}


div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="5"] {
    color:#5d5d57;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="5"]:active,
div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="5"].selected {
    background-color:#5d5d57;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event[data-type="5"] > span.icon.user {
    display:inline-block;
}


div.calendar-module > div.grid > table > tbody > tr > td > div.out > button.event {
    opacity:0.5;
}

div.calendar-module > div.grid > table > tbody > tr > td > div.out.selected > button.event {
    opacity:1;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event > span.icon {
    position:absolute;
    top:9px;
    left:7px;
    font-size:17px;
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event:hover,
div.calendar-module > div.grid > table > tbody > tr > td > div > button.event:focus {
    text-decoration:underline;*
}

div.calendar-module > div.grid > table > tbody > tr > td > div > button.event:active,
div.calendar-module > div.grid > table > tbody > tr > td > div > button.event.selected {
    color:#fff;
    text-decoration:none;
}